<template>
	<view class="page">
		<customNavBar1 title="订单填写" style='color: #111 !important;'></customNavBar1>
		<view class="height" :style="{ 'height': mt + 'px' }"></view>
		<view class="hander-one" :style="{ 'height': (h - mt - 10) + 'px', 'padding-top': '10px' }">
			<view class="topInfo">
				<view class="name">
					<!-- 拼船有均价 -->
					{{ dataJson.goodsName || '石柱村渔家乐' }}/{{ fromData.orderType == 2 ? '包船' : fromData.orderType == 3 ? '拼船' : '特价船' }}<text>￥{{ fromData.orderType == 1 ? dataJson.discountPrice : (fromData.orderType == 2 ? dataJson.normalPrice : (dataJson.avePrice || dataJson.normalPrice)) }}/{{ dataJson.avePrice ? '人' : '艘' }}</text>
				</view>
				<view class="sc" v-if="fromData.orderType == 3 && isMy != 1">拼船时间：{{ dataJson.playDate }}
					{{ dataJson.playTime }}截止
				</view>
				<view class="sc" v-else>出海时长：约{{ dataJson.playLength }}小时</view>
				<view class="address" @tap="goLocation()">
					<image :src="map"></image>
					<text class="txt">上船码头：{{ dataJson.boardSite }}</text>
					<view class="location">
						<u-icon name="map" color="#fff" size="26" label="导航" labelSize="24" labelColor="#fff"
							labelPos="right"></u-icon>
					</view>

				</view>
			</view>
			<view class="book" v-if="fromData.orderType != 1">
				<!-- 别人发布的拼船 -->
				<template v-if="(fromData.orderType == 2 || (fromData.orderType == 3 && isMy == 1))">
					<view class="tit"><text>游玩日期</text></view>
					<view class="date">
						<view :class="['item', index == currentDateIndex ? 'itemSelected' : '']"
							v-for="(item, index) in dateArr" :key="index" @click="handleDate(item, index)">
							<view :class="(item.time == todayTime && dateDisabled) ? 'disabled1' : 'normal'">
								<text>{{ weeks[item.week] }}</text>
								<text>{{ item.time }}</text>
							</view>
						</view>
						<view class="item" @click='timeShow = true'>
							<text>更多</text><text>日期</text>
						</view>
					</view>
					<view class="tit"><text>游玩时间</text></view>
					<view class="date" v-if="playtimeShowArr.length != 0" :key="update">
						<view
							:class="['item normal', index == playtimeIndex ? 'itemSelected' : '', item.disabled ? 'disabled' : '']"
							v-for="(item, index) in playtimeShowArr" :key="index" @click="handleDate2(item, index)">
							<text>{{ item.playTime }}</text>
							<text>可约</text>
						</view>
						<view class="item" @click='playShow = true'>
							<text>更多</text><text>时间</text>
						</view>
					</view>
				</template>
				<!-- 我发布拼船 -->
				<template v-if="fromData.orderType == 3 && isMy == 1">
					<view class="pcInfo first" @click="clusteringShow = true">
						<text>成团人数</text>
						<text class="txts" v-if="fromData.clusteringNum">{{ fromData.clusteringNum }}人 /
							人均¥{{ fromData.avePrice }}</text>
						<u-icon name="arrow-right" color="#AAA" size="26"></u-icon>
					</view>
					<view class="pcInfo">
						<text style="margin-right: 80rpx;">未成功顺延至下一班最近时间</text>
						<u-radio-group v-model="fromData.isPostpone2" width="90rpx"
							:disabled="fromData.playTime == '16:00' ? true : f">
							<u-radio v-for="(item, index) in isYc" label-size="26rpx" :key="index" :label="item.val"
								:name="item.name" size="40rpx" icon-size="40rpx" active-color="#007A69"
								inactive-color="#ccc">
								{{ item.name }}
							</u-radio>
						</u-radio-group>
					</view>
					<view class="Ycrules" @click="showYcRules = true">
						<u-icon name="info-circle" color="#007A69" size="24" label="顺延规则" labelSize="24"
							label-color="#007A69" labelPos="left"></u-icon>
					</view>
				</template>
				<template v-if="fromData.orderType == 3 && isMy != 1">
					<view class="pcInfo" style="padding: 0;margin-top:-10rpx">
						<text style="margin-right: 80rpx;">团长是否顺延</text>
						<u-radio-group v-model="fromData.isPostpone2" width="90rpx" :disabled="true">
							<u-radio v-for="(item, index) in isYc" label-size="26rpx" :key="index" :name="item.name"
								size="38rpx" icon-size="38rpx" active-color="#007A69" inactive-color="#ccc">
								{{ item.name }}
							</u-radio>
						</u-radio-group>
					</view>
					<view class="Ycrules" @click="showYcRules = true">
						<u-icon name="info-circle" color="#007A69" size="24" label="顺延规则" labelSize="24"
							label-color="#007A69" labelPos="left"></u-icon>
					</view>
				</template>
			</view>
			<view class="personTips">
				<u-icon name="info-circle-fill" color="#FEA400"
					customStyle="position: absolute;left: 24rpx;top: 12rpx;z-index: 1;"></u-icon>
				<template v-if="fromData.orderType==2">
					1、需添加每位游客的实名信息（6-16周岁儿童也包含在内）</br>
				</template>
				<template v-else>
					1、 需添加每位拼船游客的实名信息（6-16周岁儿童不包含在内）</br>
				</template>
				2、多人同行建议统一预订或分享预订，否则成团后，其他游客将无法上船
			</view>
			<view class="topInfo">
				<view class="tit">
					<text>游客信息</text>
					<!-- <text>最多可添加10人，需添加每个人实名信息</text> -->
				</view>
				<view class="addPerson" @click="checkPerson(index)">



					<!-- 	<u-icon name="plus-circle" label="添加游客" labelColor="#007A69" labelSize="28rpx" space="16rpx"
						size="30" color="#007A69"></u-icon> -->
					<image src="https://i.ringzle.com/file/20240415/5f00b972fc0e4e3da82e16f726cb2468.png" mode="">
					</image>
					<text>添加乘客</text>


				</view>
				<view class="chekedPerson">
					<u-cell v-for="(item2, index2) in fromData.touristList" :key="index2" style="display: flex;">
						<u-icon @click="minus(index, index2)" name="minus-circle" slot="icon" size="42" color="#FEAC2C"
							customStyle="margin-left:-30rpx;margin-top:16rpx"></u-icon>
						<view slot="title" class="title">
							<div style="display: flex">
								<view class="right">
									<view class="top">
										<text class="index">{{ item2.touristNameCopy }}</text>
										<text>{{ typeCfg[item2.personType] }}</text>
									</view>
									<view class="bottom">
										<text>{{ cardCfg[item2.cardType] }}</text>
										<text>{{ item2.touristCodeCopy }}</text>
									</view>
								</view>
							</div>
						</view>
					</u-cell>
				</view>
			</view>
			<view class="cellBox">
				<u-cell-group :border="false"
					customStyle="background-color: #fff;border-radius: 16rpx;width: 94%;margin:0 auto;">
					<u-cell>
						<text slot="icon" style="font-size: 28rpx"><text class="red">*</text>联系人</text>
						<view slot="title" class="title">
							<u--input border="none" class="input" @blur="setName" @confirm="setName" inputAlign="right"
								placeholderStyle="font-size:26rpx" placeholder="请输入联系人"
								v-model="PassengersName"></u--input>

						</view>

					</u-cell>
					<u-cell>
						<text slot="icon" style="font-size: 28rpx"><text class="red">*</text>手机号码</text>
						<view slot="title" class="title">
							<u--input border="none" class="input" inputAlign="right" placeholderStyle="font-size:26rpx"
								placeholder="请输入手机号码" v-model="fromData.linkPhoneCopy"></u--input>
						</view>

					</u-cell>
				</u-cell-group>
			</view>
			<view class="cellBox2" @click="couponList">
				<view class="cellBox-left">
					<text slot="icon" class="icon">券</text>
					<view slot="title" class="title">
						<text>优惠券</text>
					</view>
				</view>
				<view class="cellBox-right">
					<view class="cellBox-text">
						<text v-if="coupon.length==0">暂未选择优惠券</text>
						<text v-else>{{coupon.name}}</text>
					</view>
					<view class="image">
						<image src="https://i.ringzle.com/file/20240123/3cf0f794b73d4cf691371408fbd3b5e3.png"
							mode="aspectFill">
						</image>
					</view>
				</view>
			</view>
			<view class="agree">
				<image src="https://i.ringzle.com/file/20231027/db588133d67548fc82dfb0d128eac9a8.png" v-if="!agree"
					@tap="agree = !agree">
				</image>
				<image src="https://i.ringzle.com/file/20240227/9f378e2e344242c6837c5c35dd2c0ec5.png" v-else
					@tap="agree = !agree">
				</image>
				<text>我已阅读并同意</text>
				<text @tap="showXy">用户须知</text>
			</view>

			<!-- 提交栏 -->
			<view class="operation">
				<view class="left">
					<text>￥</text>
					<!-- 拼船 人均价*游客人数 -->
					<text v-if="fromData.orderType == 3">
						<text style="font-size: 48rpx;" v-if="coupon.length==0">{{ Math.floor((fromData.avePrice * fromData.touristList.length)*100)/100}}</text>
						<text style="font-size: 48rpx;" v-else-if="coupon.length!=0 && Math.floor((fromData.avePrice * fromData.touristList.length)*100)/100 > coupon.price">{{ Math.floor((fromData.avePrice * fromData.touristList.length)*100)/100 - coupon.price}}</text>
						<text style="font-size: 48rpx;" v-else>0.01</text>
					</text>
					<!-- 包船 原价 -->
					<text v-if="fromData.orderType == 2">
						<text style="font-size: 48rpx;" v-if="coupon.length==0">{{ dataJson.normalPrice}}</text>
						<text style="font-size: 48rpx;" v-else-if="coupon.length!=0 && dataJson.normalPrice > coupon.price">{{ Math.floor((dataJson.normalPrice - coupon.price)*100)/100}}</text>
						<text  v-else>0.01</text>
					</text>
					<!-- 特价船 -->
					<text v-if="fromData.orderType == 1">
						<text style="font-size: 48rpx;" v-if="coupon.length==0">{{ dataJson.discountPrice}}</text>
						<text style="font-size: 48rpx;" v-else-if="coupon.length!=0 && dataJson.discountPrice > coupon.price">{{ Math.floor((dataJson.discountPrice - coupon.price)*100)/100}}</text>
						<text style="font-size: 48rpx;" v-else>0.01</text>
					</text>
				</view>
				<view class="right">
					<text @click="btnSail" style="margin-right: 45rpx;" v-if="fromData.orderType != 3">立即预订</text>
					<text @click="btnSail" style="margin-right: 45rpx;"
						v-if="fromData.orderType == 3 && isMy == 1">发起拼团</text>
					<text @click="btnSail" style="margin-right: 45rpx;"
						v-if="fromData.orderType == 3 && isMy != 1">参与拼团</text>
				</view>
			</view>
			<u-calendar class="u-time" :show="timeShow" mode="single" @confirm="confirm" :maxDate="maxDate"
				:minDate="minDate" ref="calendar" :defaultDate="defaultDate" :formatter="formatter"
				@close="timeShow = false"></u-calendar>
			<!-- 微信支付 -->
			<WechatPay ref="wxPay" @confirmPay="toPay" @cancelPay="cancelPay"></WechatPay>
			<!-- 选择乘客 -->
			<u-popup :show="addShow" @close="addShow = false" @open='openUserInfo()'>
				<view class="details">
					<view class="title">
						<text>游客信息</text>
						<image src="@/static/index/steamerTicket/icon_close.png" @tap="addShow = false"></image>
					</view>
					<view class="has_info">
						<view class="add_user" @tap="addPerson">

							<image src="https://i.ringzle.com/file/20240415/5f00b972fc0e4e3da82e16f726cb2468.png"
								mode="">
							</image>
							<text>新增</text>
						</view>
						<view class="add_list" v-if="addList.length > 0">
							<u-swipe-action>
								<u-swipe-action-item :options="options" v-for="(item, index) in addList" :key="index"
									@click="deletePerson(item)" :ref="'swipeAction' + index">
									<view class="swipe-action u-border-top u-border-bottom">
										<view class="swipe-action__content">

											<view class="sac_item">
												<image class="chk" @tap="selectPerson(index)"
													:src="item.isSelect ? 'https://i.ringzle.com/file/20240222/ef0d5ce39fd3422692a1be8feb08e45f.png' : 'https://fsy.shengsi.gov.cn/file/20240906/119a9318c011420ba8b7677bc12fbf00.png'">
												</image>
												<view class="si_info">
													<view class="name">
														<view>{{ item.passengerNameCopy }}</view>
														<view>{{ typeCfg[item.personType] }}</view>
													</view>
													<view class="idcard">
														<text>{{ cardCfg[item.cardType] }}</text>
														<text>{{ item.cardCopy }}</text>
													</view>
												</view>
												<image class="edit"
													src="@/static/my/commonInformation/icon_edit.png"
													@tap="toEdit(item)">
												</image>
											</view>
										</view>
									</view>
								</u-swipe-action-item>
							</u-swipe-action>

						</view>
					</view>
					<view class="add_submit" @tap="confirmAdd">确定</view>
				</view>
			</u-popup>
			<!-- showYcRules 顺延规则-->
			<u-popup :show="showYcRules" @close="showYcRules = false">
				<view class="YcRulesContent">
					<view class="title">
						<text>顺延规则</text>
						<image src="@/static/index/steamerTicket/icon_close.png" @tap="showYcRules = false"
							style="right:40rpx">
						</image>
					</view>
					<view class="p">
						<view>1、拼团至截止时间未拼满，将自动为您顺延预约下一班最近可出发渔船，最多顺延两次。拼船结果以实际出票订单为准。</view>
						<view>2、该场次未拼成前，若其他游客选择包船预订，系统将自动取消拼船并退款。</view>
						<view>3、拼船失败，建议您更换其他日期或选择包船。</view>
					</view>
					<view class="add_submit" @tap="showYcRules = false">确定</view>
				</view>
			</u-popup>
			<GetPhoneNumber ref="phoneNumber" @loginSuccess="openUserInfo"></GetPhoneNumber>
		</view>
		<!-- 游玩时间 -->
		<u-popup :show="playShow" :round="10" mode="bottom" @close="playShow = false">
			<view class="PopFrame">
				<view class="PopFrame-title">
					<text>选择游玩时间</text>
					<uni-icons @click="playShow = false" type="closeempty" class="PopFrame-title-close" size="16"
						color="#33333"></uni-icons>
				</view>
				<!-- 选择游玩时间 -->
				<view class="PopFrame-list" style="padding: 30rpx 20rpx 0;">
					<view v-for="item, i in playtimeArr" :key="i" @click="checkTimeTap(item, i, 1)"
						:class="[!item.disabled ? 'PopFrame-play-box' : 'PopFrame-play-prohibit']">
						<view style='width: 100%;height: 24rpx;font-size: 24rpx;'>{{ item.playTime }}</view>
						<view style='width: 100%;height: 26rpx;font-size: 26rpx;margin-top: 10rpx;'>
							可约
						</view>
					</view>
				</view>
				<button class="PopFrame-button" @click="playShow = false">确定</button>
			</view>
		</u-popup>
		<!-- 选择成团人数 -->
		<u-popup :show="clusteringShow" :round="24" mode="bottom" @close="clusteringShow = false">
			<view class="PopFrame">
				<view class="PopFrame-title">
					<text>选择成团人数</text>
					<uni-icons @click="clusteringShow = false" type="closeempty" class="PopFrame-title-close" size="16"
						color="#33333"></uni-icons>
				</view>
				<!-- 选择成团人数 -->
				<view class="PopFrame-list" style="padding: 0 17rpx;">
					<view v-for="item, i in groupSize" :key="i" v-if="i<fromData.seatNum-1"
						:class="[clusteringIndex == i ? 'PopFrame-clustering-Selected' : 'PopFrame-clustering-box']"
						@click="clustering(item)">
						<view style="width: 100%;height: 26rpx;font-size: 26rpx;">{{ item.numberPeople }}人</view>
						<view style="width: 100%;height: 26rpx;font-size: 24rpx;margin-top: 10rpx;">
							人均￥{{ Math.floor(dataJson.normalPrice / item.numberPeople) }}</view>
					</view>
				</view>
				<button class="PopFrame-button" @click="clusteringShow = false">确定</button>
			</view>
		</u-popup>
		<!-- 不能购买儿童票提示 -->
		<view class="local_box" v-if="showTip" :style="{ 'height': (h) + 'px' }">
			<view class="lb_content">
				<view class="lbc_tip">线上无法购买儿童票，</br> 请选择包船或线下购买！</view>
				<view class="lbc_btns">
					<view class="lb_qd" @tap="showTip=false">确定</view>
				</view>
				<image src="https://i.ringzle.com/file/20240429/1876883b5065422a9d5b96518f421ed8.png"></image>
			</view>
		</view>
	</view>
</template>

<script>
	var that;
	import GetPhoneNumber from '@/compoments/Getphonenumber/index.vue'
	import WechatPay from '@/compoments/wechatPay/index.vue'
	import customNavBar1 from '@/compoments/uNavBar1/index2.vue'
	export default {
		components: {
			WechatPay,
			customNavBar1,
			GetPhoneNumber
		},
		data() {
			return {
				h: uni.getSystemInfoSync().windowHeight,
				showTip: false,
				map: 'https://i.ringzle.com/file/20240312/a823851e217949e99f3c8db7054fe0a8.png',
				h: uni.getSystemInfoSync().windowHeight,
				mt: uni.getSystemInfoSync().statusBarHeight + 44,
				minNum: 1,
				update: false,
				orderCode: '',
				showYcRules: false,
				show: false,
				cardCfg: this.$uct.typeToText,
				typeCfg: {
					1: '成人票',
					2: '儿童票',
					3: '免票儿童',
					4: '老人票'
				},
				typeCfgJson: { //景区是儿童票，2是老人票
					1: 1,
					3: 2,
					2: 4
				},
				typeCfgSc: {
					1: '成人票',
					2: '老人票',
					3: '儿童票'
				},
				addShow: false,
				currentDateIndex: 0,
				value: 1,
				tel: "",
				date: [1, 2, 3],
				addPersonShow: false,
				checkedper: [],
				addList: [],
				feeShow: false,
				list: {},
				checkTime: '',
				fromData: {
					"avePrice": 0,
					"boatId": 0,
					"clusteringNum": 0,
					"discountPrice": 0,
					"goodsDiscountPrice": 0,
					"goodsId": 0,
					"goodsName": 0,
					"goodsPrice": 0,
					"isPostpone": 0,
					"isPostpone2": 0,
					"joinGoodsId": '',
					"linkName": "",
					"linkPhone": "",
					"merchantId": 0,
					"num": 0,
					"openId": '',
					"orderType": 0,
					"playDate": "",
					"playLength": 0,
					"playTime": "",
					"publishType": 0,
					"realPrice": 0,
					"totalPrice": 0,
					"touristList": [{
						"touristCode": "",
						"touristName": "",
						"touristPhone": ""
					}]
				},
				rouList: {},
				options: [{
					text: '删除',
					style: {
						backgroundColor: '#f56c6c'
					}
				}],
				titleStyle: {
					fontSize: '36rpx',
					fontWeight: "bold",
					color: "#333333"
				},
				passengerList: [],
				lsKey: '',
				weeks: ['周日', '周一 ', '周二', '周三', '周四', '周五', '周六'],
				dateArr: [],
				playShow: false,
				playtimeIndex: 0,
				playtimeShowArr: [],
				// 游玩时间数组
				playtimeArr: [],
				//currentTime: null,
				timeShow: false,
				currentYear: '',
				checkTime: '',
				todayTime: '', //今天的日期 08-24
				scenicName: '',
				isScenicTicketDTOList: '',
				oprationIndex: 0,
				// 拼船
				isYcval: '',
				isYc: [{
					name: '是',
					val: 1,
				}, {
					name: '否',
					val: 0,
				}],
				dataJson: {},
				maxDate: '', //最大
				clusteringShow: false, //拼团人数
				// 成团人数数组
				groupSize: [{
						numberPeople: 2,
					},
					{
						numberPeople: 3,
					},
					{
						numberPeople: 4,
					},
					{
						numberPeople: 5,
					},
					{
						numberPeople: 6,
					},
					{
						numberPeople: 7,
					},
					{
						numberPeople: 8,
					},
					{
						numberPeople: 9,
					},
					{
						numberPeople: 10,
					}
				],
				isMy: false,
				noTime: false,
				dateDisabled: false,
				mtid: '1748948099092451329',
				openId: JSON.parse(uni.getStorageSync('userInfo')).openId,
				agree: false,
				PassengersName: '',
				coupon:[]
			}
		},
		onReady() {
			that = this;
			this.setUpDate();
			this.$refs.calendar.setFormatter(this.formatter())
		},
		onLoad(option) {
			that = this;
			this.isMy = option.isMy || null;
			this.dataJson = JSON.parse(decodeURIComponent(option.data ? option
				.data : '{}'));
			this.checkTime = this.getDay(0).time; //默认当天日期
			this.getTime();
			this.scenicName = option.scenicName;
			var today = new Date();
			var tYear = today.getFullYear();
			this.currentYear = tYear;
			this.fromData = {
				seatNum: this.dataJson.seatNum,
				clusteringNum: 0, //成团人数
				avePrice: this.dataJson.avePrice || 0, //人均价,
				goodsPrice: this.dataJson.normalPrice, //原价
				isPostpone: this.dataJson.isPostpone,
				isPostpone2: this.dataJson.isPostpone == 1 ? '是' : this.isMy == 1 ? '是' : '否',
				joinGoodsId: '',
				residueClusteringNum: this.dataJson.residueClusteringNum,
				// 拼船
				boatId: this.dataJson.boatId,
				discountPrice: this.dataJson.discountPrice || 0,
				goodsId: this.dataJson.id,
				goodsName: this.dataJson.goodsName,
				merchantId: '1748948099092451329',
				num: 0,
				openId: this.isMy ? JSON.parse(uni.getStorageSync('userInfo')).openId : this.dataJson.openId,
				linkPhone: uni.getStorageSync('userInfo') ? JSON.parse(uni.getStorageSync('userInfo')).mobile : '',
				linkPhoneCopy: uni.getStorageSync('userInfo') ? JSON.parse(uni.getStorageSync('userInfo')).mobile : '',
				linkName: "",
				linkNameCopy: "",
				orderType: this.dataJson.goodsType,
				num: option.totalNumber,
				playLength: this.dataJson.playLength,
				publishType: this.isMy ? 2 : this.dataJson.publishType,
				realPrice: this.dataJson.normalPrice,
				totalPrice: this.dataJson.normalPrice,
				playDate: this.currentYear + '-' + this.checkTime,
				touristList: [],
				minDate: '',
				defaultDate: '',

			}
			if (this.isMy == 1) {
				this.fromData.orderType = 3;
			}
			//拼船不取时间了
			//不是拼单才去获取第一个时间
			if ((this.fromData.orderType == 3 && this
					.isMy != 1) || this.fromData.orderType ==
				1) {
				this.fromData.playDate = this.dataJson.playDate;
				this.fromData.playTime = this.dataJson.playTime;
			} else {
				this.getStatus(this.currentYear + '-' + this.checkTime);
			}

		},
		mounted() {},
		watch: {
			playtimeShowArr(newval, oldval) {
				if (newval.length != 0) {
					if (newval[this.playtimeIndex].disabled) {
						this.playtimeIndex = null;
						this.fromData.playTime = '';
					}
				}
			},
		},
		onShow() {
			this.toGetPassengers();
			let that = this
			uni.$on('updateData',function(data){
				console.log(data);
				if(data){
					that.coupon = data
				}else{
					that.coupon = []
				}
				
			})
		},
		methods: {
			couponList(){
				let price
				if(this.fromData.orderType==3){
					price = Math.floor(this.fromData.avePrice * this.fromData.touristList.length)
				}
				if(this.fromData.orderType==2){
					price = this.dataJson.normalPrice
				}
				if(this.fromData.orderType==1){
					price = this.dataJson.discountPrice 
				}
				uni.navigateTo({
				    url: `/pagesMy/coupon/useList?type=5&price=${price}`
				});
			},
			setName(e) {
				this.PassengersName = e;
				this.fromData.linkName = e;
				this.fromData.linkNameCopy = e;
			},
			// 设置选择日期天数
			setUpDate() {
				const d = new Date()
				const year = d.getFullYear()
				let month = d.getMonth() + 1
				const date = d.getDate() + 6
				this.maxDate = year + '-' + month + '-' + date;
			},
			// 显示七天可售
			formatter(day) {
				// let startIndex = 0;
				// if (that.dateDisabled) { //今天没有可选点
				// 	startIndex = 1;
				// }
				if(!day) return
				for (let i = 0; i < 7; i++) {
					let now = new Date(new Date().getFullYear() + '-' + day.month + '-' + day.day).Format(
						'yyyy-MM-dd');
					let temp = new Date(new Date().setDate(new Date().getDate() + i)).Format('yyyy-MM-dd');
					if (now == temp) {
						day.bottomInfo = '可售'
					}
				}
				return day
			},

			checkPerson(index) {
				this.addShow = true;
			},
			// close() {
			// 	this.timeShow = false;
			// },
			showXy() {
				uni.navigateTo({
					url: '/pagesTrip/fishJiale2/instructions'
				})
			},
			openUserInfo() {
				this.toGetPassengers()
			},
			confirmAdd() {
				this.coupon = []
				//判断成团数是否和游客数量一致
				this.fromData.touristList = this.addList.filter(d => d.isSelect == true);
				if (this.fromData.touristList.length == 0) {
					return
				}
				//只要有一个是儿童类型就提示
				if (this.fromData.orderType != 2) {
					//只要有一个是儿童类型就提示
					const result = this.fromData.touristList.every(item => item.personType != 2&&item.personType != 3)
					if (!result) {
						this.showTip = true;
						return
					}
				}
				
				this.addList.forEach((d, i) => {
					this.$set(this.addList[i], 'isSelect', false)
				})
				this.fromData.touristList = this.fromData.touristList.map(({
					personType,
					passengerName,
					card,
					cardType
				}) => ({
					personType,
					cardType,
					touristCode: card,
					touristCodeCopy: this.$aesTm.tuomin(card, 3),
					touristName: passengerName,
					touristNameCopy: this.$aesTm.tuomin(passengerName, 1),
				}))
				this.PassengersName = this.fromData.touristList[0].touristName
				this.fromData.linkName = this.fromData.touristList[0].touristName
				this.fromData.linkNameCopy = this.fromData.touristList[0].touristName

				this.addShow = false;

			},
			getTime(currentDate) {
				let dateArr = [];
				for (let i = 0; i < 4; i++) {
					let date = this.getDay(i, currentDate);
					dateArr.push(date);
				}
				this.dateArr = dateArr;
			},
			//计算两个日期间隔几天
			daysDistance(date2) {
				let date1 = Date.parse(new Date());
				date2 = Date.parse(date2);
				//计算两个日期之间相差的毫秒数的绝对值
				var distance = Math.abs(date2 - date1);
				//毫秒数除以一天的毫秒数,就得到了天数
				var days = Math.floor(distance / (24 * 3600 * 1000)) + 1;
				return days;
			},
			getDay(day, currentDate) {
				if (currentDate) {
					var today = new Date(currentDate);
				} else {
					var today = new Date();
				}
				var targetday_milliseconds = today.getTime() + 1000 * 60 * 60 * 24 * day;

				today.setTime(targetday_milliseconds); //注意，这行是关键代码

				var tYear = today.getFullYear();
				this.currentYear = tYear;
				var tMonth = today.getMonth();
				var tDate = today.getDate();
				var week = today.getDay();
				tMonth = this.doHandleMonth(tMonth + 1);
				tDate = this.doHandleMonth(tDate);
				let json = {
					time: tMonth + "-" + tDate,
					week: week,
					price: this.list.realPrice || 0.01,
				}
				return json
			},
			doHandleMonth(month) {
				var m = month
				if (month.toString().length == 1) {
					m = "0" + month;
				}
				return m;
			},
			selectPerson(index) {
				this.$set(this.addList[index], 'isSelect', !this.addList[index].isSelect);
			},
			deletePerson(item) {
				this.$api.del('/api/commonPerson', [item.id]).then(res => {
					if (res.data.code === 0) {
						this.addList.forEach((d, i) => {
							this.$refs['swipeAction' + i][0].closeHandler();
						})
						this.toGetPassengers();
						let fidx = this.fromData.touristList.findIndex(d => d.id == item.id);
						if (fidx > -1) this.fromData.touristList.splice(fidx, 1);
					} else this.$showModal(res.data.msg)
				})
			},
			toEdit(item, main) {
				if (main) {
					uni.navigateTo({
						url: '/pagesMy/commonInformation/add?type=ship&main=1&item=' + JSON.stringify(
							item),
						events: {
							editPassengerSuccess: data => {
								this.toGetPassengers();
							},
							editPassenger: data => {

							},
						}
					})
				} else {
					uni.navigateTo({
						url: '/pagesMy/commonInformation/add?type=ship&item=' + JSON.stringify(item),
						events: {
							editPassengerSuccess: data => {
								this.toGetPassengers();
							}
						}
					})
				}

			},
			goLocation() {
				let mapdata = {
					latitude: parseFloat(this.dataJson.latitude),
					longitude: parseFloat(this.dataJson.longitude),
					name: this.dataJson.areaDetail,
				}
				uni.openLocation(mapdata);
			},
			toGetPassengers(callback) {
				this.$api.get('/api/commonPerson/list', {
					openId: JSON.parse(uni.getStorageSync('userInfo')).openId
				}).then(res => {
					if (res.data.code === 0) {
						this.addList = this.$uct.setPersonType(res.data.data);
						this.addList.forEach(l => {
							l.passengerNameCopy = this.$aesTm.tuomin(l.passengerName, 1);
							l.cardCopy = this.$aesTm.tuomin(l.card, 3);
						})
						this.addList.forEach((d, i) => {
							this.$set(this.addList[i], 'isSelect', false);
						})
						callback && callback()
					} else this.$showModal(res.data.msg);
				})
			},
			//选择更多日期
			handleDate(item, index) {
				if (item.time == this.getDay(0).time && this.dateDisabled) {
					return
				}
				this.currentDateIndex = index;
				this.checkTime = item.time;
				this.fromData.playDate = this.currentYear + '-' + this.checkTime;
				this.getStatus(this.fromData.playDate);
			},
			//选择成团人数
			clustering(item) {
				this.fromData.avePrice = Math.floor((this.dataJson.normalPrice / item.numberPeople));
				this.fromData.clusteringNum = item.numberPeople;
				this.clusteringShow = false;
			},
			//选择游玩时间
			//获取时间点可不可约
			getStatus(date) {
				this.playtimeIndex = 0;
				this.$api.get('/scenic/api/order/writeOrder/' + date + '/' + this.mtid).then(res => {
					if (res.data.code == 0 && res.data.data) {
						this.fromData.playDate = date;
						let hour = new Date().getHours(); //获取当前时间点，
						let tt = new Date().getTime();
						let ntt = tt + 60 * 60 * 1000;
						let nhour = new Date(ntt).getHours(); //往后一小时

						this.playtimeArr = res.data.data;
						//处理不可选时间点
						this.playtimeArr.forEach((d, i) => {
							if (this.fromData.playDate == new Date().Format('yyyy-MM-dd')) {
								if ((nhour > parseFloat(this.playtimeArr[i].playTime)) || this
									.playtimeArr[
										i]
									.stockAmount == 0) {
									this.$set(this.playtimeArr[i], 'disabled', true);
								} else {
									this.$set(this.playtimeArr[i], 'disabled', false);
								}
							} else {
								if (this.playtimeArr[i].stockAmount == 0) {
									this.$set(this.playtimeArr[i], 'disabled', true);
								} else {
									this.$set(this.playtimeArr[i], 'disabled', false);
								}
							}
						})

						// if (this.dataJson.playLength == 2) {
						// 	let len2 = this.playtimeArr.length - 1;
						// 	this.$set(this.playtimeArr[len2], 'disabled', true);
						// }
						//今天日期进来过滤不可点时间点
						if (this.fromData.playDate == new Date().Format('yyyy-MM-dd')) {
							//当前时间点往后一个点是否匹配到
							let indexStart = this.playtimeArr.findIndex((item) => parseFloat(item
									.playTime) ==
								nhour) //是否有匹配点，
							if (indexStart > -1) { //如果在游玩时间内匹配到，就选匹配到的游玩时间
								this.playtimeIndex = ''
								setTimeout(() => {
									this.checkTimeTap(this.playtimeArr[indexStart],
										indexStart, 0,
										nhour)
								}, 500)
							} else { //没有匹配再判断
								let timesEnd = 16;
								if (nhour > timesEnd) { //大于16 点 请求第二天
									let newPlayDate = this.currentYear + '-' + this.getDay(1).time;
									this.getStatus(newPlayDate);
									this.currentDateIndex = 1;
									this.dateDisabled = true; //今日不可点（优化，日历上也不可点）
									this.todayTime = this.checkTime;
									this.fromData.playDate = newPlayDate;
								} else { //否则否认第一个时间点4点凌晨0-3点的
									this.playtimeShowArr = this.playtimeArr.slice(0, 4);
									this.fromData.playTime = this.playtimeShowArr[0].playTime;
								}
							}
						} else {
							this.playtimeShowArr = this.playtimeArr.slice(0, 4);
							this.update = !this.update;
							this.fromData.playTime = this.playtimeShowArr[0].playTime;
						}
					}

				})
			},
			checkTimeTap(item, index, tap, mins) {
				var min;
				if (!mins) {
					min = new Date().getHours();
				} else {
					mins = item.playTime;
				}
				if ((this.fromData.playDate == new Date().Format('yyyy-MM-dd')) && (min - parseFloat(item
							.playTime) > -
						1)) {
					return this.$showToast('时间已过，请重新选择游玩时间')
				}
				this.playShow = false;
				if (tap == 1 && item.disabled) {
					return false
				}
				if (index + 3 > this.playtimeArr.length - 1) {
					let len = (index + 3) - (this.playtimeArr.length - 1);
					this.playtimeShowArr = this.playtimeArr.slice(index - len, this.playtimeArr.length);
					this.playtimeIndex = len;
					this.fromData.playTime = this.playtimeShowArr[this.playtimeIndex].playTime;
				} else {
					this.playtimeShowArr = this.playtimeArr.slice(index, index + 4);
					this.playtimeIndex = 0;
					this.fromData.playTime = this.playtimeShowArr[this.playtimeIndex].playTime;
				}
				if (this.fromData.playTime == '16:00') {
					this.fromData.isPostpone2 = '否';
				} else {
					this.fromData.isPostpone2 = '是';
				}
			},
			handleDate2(item, index) {
				if (item.stockAmount == 0 || item.disabled) {
					return false;
				}
				//游玩时间
				this.playtimeIndex = index;
				this.fromData.playTime = item.playTime;
				if (this.fromData.playTime == '16:00') {
					this.fromData.isPostpone2 = '否';
				} else {
					this.fromData.isPostpone2 = '是';
				}
			},
			//单程确认选择日期
			confirm(e) {
				//this.currentDateIndex = 0;

				let days = this.daysDistance(e[0]); //距离今天差几天 减去4,
				this.currentDateIndex = days - 3 > 0 ? days - 3 : 0;
				let newDate = this.currentYear + '-' + this.getDay(3).time;
				this.checkTime = days - 3 > 0 ? newDate : e[0];
				//this.playDate =this.checkTime;
				this.playDate = e[0];
				this.getStatus(this.playDate);
				this.timeShow = false;
				this.getTime(this.checkTime); //09-11
			},
			toHref(url) {
				uni.navigateTo({
					url: url
				})
			},
			close2() {
				this.$set(this, 'feeShow', false);
			},
			minus(index, index2) {
				this.coupon = []
				this.fromData.touristList.splice(index2, 1);
			},
			addPerson() {
				this.$login().then(res => {
					if (res === 0) {
						uni.navigateTo({
							url: '/pagesMy/commonInformation/add?type=ship',
							events: {
								addPassengerSuccess: data => {
									this.toGetPassengers();
								}
							}
						})
					} else this.$refs['phoneNumber'].show = true;
				})
			},
			// 提交订单
			btnSail() {
				if (this.fromData.playTime == '') {
					return this.$showToast("请选择游玩时间");
				}
				if (this.fromData.touristList.length == 0) {
					return this.$showToast("请添加乘客");
				}
				if (this.fromData.linkNameCopy == '') {
					return this.$showToast("请填写联系人");
				}
				if (!this.$reg.mobile(this.fromData.linkPhoneCopy)) {
					return this.$showToast("请填写正确的联系人手机号");
				}
				if (!this.agree) return this.$showToast('请阅读并同意用户须知');
				let url = '';

				if (this.fromData.orderType == 2 || this.fromData.orderType == 1) { //包船和特价
					url = "/scenic/api/order/placeFisherOrder";
					if (this.fromData.orderType == 1) {
						this.fromData.realPrice = this.fromData.discountPrice;
						this.fromData.totalPrice = this.fromData.realPrice;
					}
				}
				if (this.fromData.orderType == 3 && this.isMy == 1) { //我发起的
					url = '/scenic/api/order/publishJoinBoat';
					if (this.fromData.avePrice == 0) {
						return this.$showToast('请选择拼团人数')
					}
					this.fromData.realPrice = Math.floor(this.fromData.avePrice * this.fromData.touristList
						.length);
					this.fromData.totalPrice = this.fromData.realPrice;
				}
				if (this.fromData.orderType == 3 && this.isMy != 1) { //拼船
					url = '/scenic/api/order/goJoinBoat';
					this.fromData.joinGoodsId = this.dataJson.id;
					this.fromData.realPrice = Math.floor(this.fromData.avePrice * this.fromData.touristList
						.length);
					this.fromData.totalPrice = this.fromData.realPrice;
				}
				this.fromData.num = this.fromData.touristList.length;
				this.fromData.isPostpone = this.fromData.isPostpone2 == '是' ? 1 : 0;

				let newData = JSON.parse(JSON.stringify(this.fromData));
				newData.linkName = this.$aesTm.encrypt(newData.linkNameCopy);
				newData.linkPhone = this.$aesTm.encrypt(newData.linkPhoneCopy);
				newData.touristList.forEach(d => {
					delete d.touristNameCopy
					delete d.touristCodeCopy
					d.touristName = this.$aesTm.encrypt(d.touristName);
					d.touristCode = this.$aesTm.encrypt(d.touristCode);
				})
				delete newData.linkNameCopy
				delete newData.linkPhoneCopy
				newData.discountCouponUserId = this.coupon.id
				this.$api.post(url, newData)
					.then(res => {
						if (res.data.code == 0) {
							this.orderId = res.data.data.orderCode;
							this.realityPay = res.data.data.realityPay
							this.$refs.wxPay.payShow = true;
						} else {
							uni.showModal({
								title: "提示",
								content: res.data.msg,
								confirmText: "确定",
								showCancel: false,
								success: (res) => {

								}
							})

							//return this.$showToast(res.data.msg,6000)
							// uni.showToast({
							// 	title: res.data.msg,
							// 	icon: 'none'
							// })
						}
					})
			},
			//关闭支付弹框
			closePay() {
				this.$refs.wxPay.payShow = false;
				setTimeout(() => {
					uni.redirectTo({
						url: '/pagesMy/order/index?name=渔家乐&type=0&typeIndex=5'
					})
				}, 1000)
			},
			toPay() {
				this.lsKey = 'toPay';
				this.$login().then(res => {
					if (res === 0) return this.confrimPay();
					else this.$refs['phoneNumber'].show = true;
				})
			},
			cancelPay() {
				uni.redirectTo({
					url: '/pagesMy/FishJialeList/FishJialeDetails?id=' + this.orderId
				})
			},
			confrimPay() {
				this.$api.post('/order/icbc/createOrder', {
					orderCode: this.orderId,
					tradeType: 'JSAPI',
					openId: JSON.parse(uni.getStorageSync('userInfo')).openId
				}, false).then(res => {
					if (res.statusCode == 200 && res.data != null) {
						this.$refs.wxPay.payShow = false;
						this.$wxPay(res.data).then(result => {
							uni.navigateTo({
								url: `/pagesTrip/fishJiale2/paySuccess?orderId=${this.orderId}&realityPay=${this.realityPay}`
							})
						})
					}
				})
			},
		},
	}
</script>
<style lang="less">
	.personTips {
		position: relative;
		height: 120rpx;
		background: #FFFDF7;
		padding: 12rpx 24rpx 12rpx 62rpx;
		font-family: PingFangSC, PingFang SC;
		font-weight: 400;
		font-size: 24rpx;
		color: #FEA400;
		line-height: 32rpx;

		.icon {
			width: 24rpx;
			height: 24rpx;
			display: inline-block;
		}
	}

	.local_box {
		width: 100%;
		position: absolute;
		top: 0;
		left: 0;
		background: rgba(0, 0, 0, 0.2);
		z-index: 99999;
		display: flex;
		align-items: center;
		justify-content: center;

		.lb_content {
			width: calc(100% - 146rpx);
			background: url(https://i.ringzle.com/file/20240429/9ca472b33c094035a1d7a00f110ac59d.png) no-repeat;
			background-size: 100% 100%;
			border-radius: 24rpx;
			padding: 143rpx 38rpx 44rpx;
			box-sizing: border-box;
			position: relative;
			z-index: 11;

			.lbc_tip {
				text-align: center;
				font-size: 30rpx;
				font-family: PingFangSC, PingFang SC;
				font-weight: 400;
				color: #333333;
				line-height: 48rpx;
			}

			.lbc_btn {
				width: calc(100% - 48rpx);
				height: 88rpx;
				background: #007a69;
				box-shadow: 0rpx 6rpx 16rpx 0rpx rgba(13, 191, 253, 0.3);
				border-radius: 44rpx;
				line-height: 88rpx;
				text-align: center;
				font-size: 32rpx;
				font-family: PingFang-SC, PingFang-SC;
				font-weight: bold;
				color: #ffffff;
				letter-spacing: 2rpx;
				margin: 63rpx 24rpx 0;
			}

			.lbc_btns {
				width: calc(100% - 76rpx);
				height: 88rpx;
				margin: 63rpx 38rpx 0;
				display: flex;
				justify-content: center;

				&>view {
					width: calc(50% - 14rpx);
					height: 100%;
					border-radius: 44rpx;
					display: flex;
					align-items: center;
					justify-content: center;
					font-family: PingFang-SC, PingFang-SC;
					font-weight: bold;
					font-size: 32rpx;

					&.lb_qd {
						background: #007a69;
						color: #ffffff;
					}
				}
			}

			image {
				width: 255rpx;
				height: 168rpx;
				position: absolute;
				left: 50%;
				margin-left: -127.5rpx;
				top: -60rpx;
				z-index: 12;
			}
		}
	}

	// 弹框样式
	.PopFrame {
		background: white;
		height: 975rpx;
		padding: 40rpx 20rpx;
		border-radius: 30rpx 30rpx 0rpx 0rpx;

		// 弹框头部标题
		.PopFrame-title {
			text-align: center;
			margin-bottom: 40rpx;
			font-weight: bold;
			font-size: 36rpx;
			color: #111111;
			height: 50rpx;
			line-height: 50rpx;

			.PopFrame-title-close {
				position: absolute;
				right: 30rpx;
				// float: right;
				font-weight: normal;
				color: #333333;
			}
		}

		// 弹框中列表样式   <!-- 选择游玩时间 -->
		.PopFrame-list {
			display: flex;
			flex-wrap: wrap;
			align-content: space-between;
			box-sizing: border-box;

			// 游玩弹框列表中的单个样式
			.PopFrame-play-box {
				width: 118rpx;
				height: 142rpx;
				border-radius: 12rpx;
				border: 1rpx solid #EFEFEF;
				margin: 10rpx 8rpx;
				text-align: center;
				color: #333333;
				box-sizing: border-box;
				display: flex;
				flex-wrap: wrap;
				align-content: center;
			}

			// 游玩无法选择弹框样式
			.PopFrame-play-prohibit {
				width: 118rpx;
				height: 142rpx;
				border-radius: 12rpx;
				border: 1rpx solid #EFEFEF;
				margin: 10rpx 8rpx;
				text-align: center;
				color: #AAAAAA;
				box-sizing: border-box;
				display: flex;
				flex-wrap: wrap;
				align-content: center;
			}

			// 弹框中列表样式   <!-- 选择成团人数 --> clustering
			.PopFrame-clustering-box {
				width: 148rpx;
				height: 142rpx;
				border-radius: 12rpx;
				border: 1rpx solid #EFEFEF;
				box-sizing: border-box;
				text-align: center;
				margin: 10rpx 11rpx;
				display: flex;
				flex-wrap: wrap;
				align-content: center;
			}

			// 游玩单个弹框列表选中样式
			.PopFrame-clustering-Selected {
				width: 148rpx;
				height: 142rpx;
				border-radius: 12rpx;
				border: 1rpx solid #007A69;
				color: #007A69;
				box-sizing: border-box;
				text-align: center;
				margin: 10rpx 11rpx;
				display: flex;
				flex-wrap: wrap;
				align-content: center;
			}
		}

		// 参与拼团样式
		.Teamwork-title {
			height: 45rpx;
			font-family: PingFang-SC, PingFang-SC;
			font-weight: bold;
			font-size: 32rpx;
			color: #111111;
			line-height: 45rpx;
			text-align: center;
			font-style: normal;
			margin-bottom: 27rpx;
		}

		// 参与拼团文字样式
		.Teamwork-text {
			width: 480rpx;
			height: 144rpx;
			font-family: PingFang-SC, PingFang-SC;
			font-weight: bold;
			font-size: 30rpx;
			color: #FF4141;
			line-height: 48rpx;
			text-align: center;
			font-style: normal;
			margin: auto;
		}

		// 参与拼团图片样式
		.Teamwork-image {
			display: flex;
			box-sizing: border-box;
			padding: 30rpx;
			margin-top: 174rpx;

			view {
				height: 100rpx;
				width: 100rpx;
				margin: 0 16rpx;
			}

			.Teamwork-image-none {
				font-size: 40rpx;
				display: flex;
				justify-content: center;
				align-items: center;
				color: #bebebe;
			}

			.Teamwork-image-none,
			image {
				width: 100%;
				height: 100%;
				border-radius: 50%;
				border: 2rpx dotted #bebebe;
			}

			.Teamwork-image-text {
				width: 76rpx;
				height: 28rpx;
				background: #007A69;
				border-radius: 14rpx;
				font-family: PingFangSC, PingFang SC;
				font-weight: 400;
				font-size: 20rpx;
				color: #FFFFFF;
				line-height: 28rpx;
				text-align: justify;
				font-style: normal;
				text-align: center;
			}
		}

		// 确定按钮样式
		.PopFrame-button {
			width: 702rpx;
			height: 88rpx;
			background: #007A69;
			border-radius: 44rpx;
			position: absolute;
			left: 50%;
			transform: translateX(-50%);
			bottom: 37rpx;
			font-family: PingFang-SC, PingFang-SC;
			font-weight: bold;
			font-size: 32rpx;
			color: #FFFFFF;
			line-height: 88rpx;
			text-align: center;
			font-style: normal;
		}
	}
</style>
<style lang="less">
	/deep/.u-navbar__content__title {
		color: #111111 !important;
	}

	/deep/.u-radio-group {
		gap: 0 20rpx;
	}

	.agree {
		display: flex;
		align-items: center;
		padding: 40rpx 24rpx 40rpx;

		image {
			width: 36rpx;
			height: 36rpx;
			margin-right: 16rpx;
		}

		text {
			font-size: 26rpx;
			font-family: PingFangSC-Regular, PingFang SC;
			font-weight: 400;
			color: #666666;

			&:last-child {
				color: #007A69;
				margin-left: 10rpx;
			}
		}
	}

	.address {
		display: flex;
		align-items: center;
		justify-content: space-between;
		color: #777;

		image {
			width: 36rpx;
			height: 36rpx;
		}

		.txt {
			width: 100px;
			font-size: 26rpx;
			flex: 1;
			margin-left: 8rpx;
		}
	}
</style>
<style scoped lang="scss">
	/deep/.u-input__content__field-wrapper__field {
		font-size: 26rpx !important;
	}

	.red {
		color: #f44;
	}

	page,
	.page {
		// background-color: #F5F8FA;
		// margin-top: 160rpx;
		// padding-bottom: 160rpx;
		// height: 100vh;
		background: #F5F8FA;
		background: url('https://i.ringzle.com/file/20240129/323bce42369f4d228d5653b8a4249095.png') top center no-repeat;
		background-size: 100% 30%;


	}



	.hander-one {
		background: #F5F8FA url('https://i.ringzle.com/file/20240129/323bce42369f4d228d5653b8a4249095.png') top center no-repeat;
		background-size: 100% 30%;
		box-sizing: border-box;
		padding-bottom: 140rpx;
		overflow-y: auto;

	}

	.operate {
		margin: 20rpx auto 10rpx;
		border-radius: 40rpx;
		background-color: #fff;
		width: 94%;

	}

	// 费用明细
	.feeDetail {
		background-color: #fff;
		border-radius: 24rpx 24rpx 0 0;
		height: 680rpx;
		overflow: auto;
		padding: 50rpx 30rpx;
		border-bottom: 1px solid #eee;

		.tit {
			display: flex;
			justify-content: space-between;
			margin-bottom: 60rpx;

			text {
				&:nth-child(1) {
					font-size: 36rpx;
					color: #333;
				}
			}
		}

		.list {
			.top {
				display: flex;
				justify-content: space-between;
				margin-top: 20rpx;

				:nth-child(1) {
					font-size: 30rpx;
				}

				:nth-child(2) {
					flex: 1;
					margin: 4px 0 0 15px;
				}

				:nth-child(3) {
					// width: 300rpx;
					// text-align: right;
					color: #FF4141;
					font-size: 36rpx;
				}


			}

			.time {
				display: inline-block;
				font-size: 24rpx;
				margin-bottom: 20rpx;
				color: #808080;

			}
		}

	}

	// popoup 新增游客弹框 
	.addPersonPop {
		.inner {
			padding: 0 24rpx 48rpx;


			.tit {
				font-size: 32rpx;
				color: #333;
				text-align: center;
				margin-bottom: 40rpx;
				margin-top: 64rpx;
			}

			.addPerson {
				height: 88rpx;
				border-radius: 16rpx;
				margin-bottom: 60rpx;
			}

			.checkbox {
				margin-left: -30rpx;
			}

			.title {
				margin-left: 12rpx;

				.top {
					margin-bottom: 12rpx;

					text {
						&:nth-child(1) {
							color: #333;
							font-size: 32rpx;
							margin-right: 20rpx;
							font-weight: bold;
							font-family: PingFang-SC-Bold, PingFang-SC;
						}

						&:nth-child(2) {
							background-color: #EEF0F5;
							border-radius: 8rpx;
							color: #94A9C8;
							font-size: 24rpx;
							padding: 2rpx 12rpx;
						}
					}
				}

				.bottom {
					text {
						&:nth-child(1) {
							color: #AAA;
							font-size: 24rpx;
							margin-right: 8rpx;
						}

						&:nth-child(2) {
							color: #111;
							font-size: 24rpx;
						}
					}
				}
			}
		}
	}

	.operation {
		display: flex;
		align-items: center;
		justify-content: space-between;
		padding: 0 30rpx;
		background-color: #fff;
		height: 112rpx;
		position: fixed;
		bottom: 0;
		width: 100%;
		z-index: 10;
		box-shadow: 0 -2rpx 8rpx rgba(0, 0, 0, 0.06);

		.left {
			color: #FF4141;

			text {
				vertical-align: middle;
			}

			text:nth-child(1) {
				margin-right: 16rpx;
				font-size: 24rpx;
			}

			text:nth-child(2) {
				font-size: 48rpx;
			}

			// text:nth-child(4) {
			// 	position: absolute;
			// 	font-size: 24rpx;
			// 	color: #AAA;
			// 	bottom: -16rpx;
			// 	left: 0;
			// }
		}

		.right {
			display: flex;
			min-width: 200rpx;

			text {
				width: 220rpx;
				height: 80rpx;
				text-align: center;
				line-height: 80rpx;
				color: #fff;
				border-radius: 40rpx;
				margin-left: 24rpx;
				font-size: 32rpx;
				// background-image: linear-gradient(to right, #FF7D43, #FEAC2C);
				background-color: #007A69;
			}
		}

	}

	.topInfo {
		padding: 36rpx 24rpx;
		background-color: #fff;
		width: calc(100% - 48rpx);
		box-sizing: border-box;
		margin: 0 auto;
		border-radius: 16rpx;
		margin-bottom: 20rpx;

		.tit {
			margin-bottom: 36rpx;

			text {
				&:nth-child(1) {
					font-size: 32rpx;
					color: #111;
					font-weight: bold;
					font-family: PingFang-SC-Bold, PingFang-SC;
				}

				&:nth-child(2) {
					font-size: 24rpx;
					margin-left: 20rpx;
					color: #999;
				}
			}


		}

		.name {
			font-size: 36rpx;
			color: #111;
			font-weight: bold;
			display: flex;
			justify-content: space-between;
			align-items: center;

			text {
				font-size: 30rpx;
				color: #111;
			}

			// .left {
			// 	font-size: 32rpx;
			// }

			// .right {
			// 	font-weight: inherit;
			// 	color: #999;
			// 	font-size: 24rpx;

			// 	text {
			// 		font-size: 36rpx;
			// 	}
			// }
		}

		.sc {
			margin: 20rpx 0 14rpx;
			font-size: 28rpx;
			color: #777;
		}

		.addPerson {
			height: 68rpx;
			display: flex;
			justify-content: center;
			align-items: center;
			// background-color: #F0F8F6;


			border-radius: 16rpx;
			// border: 1rpx dotted #007A69;
			background-image: url('https://i.ringzle.com/file/20240415/5d72e22d58744b9bb740a3333d3d2b42.png');
			background-repeat: no-repeat;
			background-size: 100% 100%;
			// padding: 16rpx;
			// background-color: #F0F8F6;

			image {
				width: 26rpx;
				height: 26rpx;
			}

			text {
				font-size: 24rpx;
				font-family: PingFangSC-Regular, PingFang SC;
				font-weight: 400;
				color: #007A69;
				margin-left: 8rpx;
			}


		}

		.location {
			width: 142rpx;
			height: 64rpx;
			background-color: #007A69;
			color: #fff;
			display: flex;
			align-items: center;
			justify-content: center;
			border-radius: 40rpx;
		}

	}


	.chekedPerson {
		display: block;
		width: 100%;
		margin-top: 14rpx;

		.title {
			margin-left: 12rpx;

			.index {
				font-size: 30rpx;
				font-weight: bold;
				font-family: PingFang-SC-Bold, PingFang-SC;
				margin-right: 20rpx;
				color: #333;
			}

			.top {
				margin-bottom: 8rpx;

				text {
					&:nth-child(2) {
						background-color: #EEF0F5;
						border-radius: 8rpx;
						color: #94A9C8;
						font-size: 24rpx;
						padding: 2rpx 12rpx;
					}
				}
			}

			.bottom {
				text {
					color: #AAA;
					font-size: 24rpx;
					margin-right: 6rpx;
				}
			}
		}

	}

	.mark {
		margin-bottom: 70rpx;
		color: #FF7D01;
		font-size: 24rpx;

		text:nth-child(2) {
			margin: 0 24rpx;
		}
	}

	.book {
		background-color: #fff;
		margin: 20rpx auto;
		padding: 36rpx 24rpx 2rpx;
		border-radius: 16rpx;
		width: calc(100% - 48rpx);
		box-sizing: border-box;

		.tit {
			margin-bottom: 30rpx;

			text {
				&:nth-child(1) {
					font-size: 32rpx;
					color: #111;
					font-weight: bold;
					font-family: PingFang-SC-Bold, PingFang-SC;
				}

				&:nth-child(2) {
					font-size: 24rpx;
					margin-left: 20rpx;
					color: #999;
				}
			}


		}

		.date {
			display: grid;
			grid-template-columns: 17.5% 17.5% 17.5% 17.5% 17.5%;
			gap: 20rpx;
			margin-bottom: 40rpx;

			.normal {
				padding-top: 30rpx;
			}

			.item {
				//padding: 30rpx 0 0;
				border: 1rpx solid #808080;
				font-size: 24rpx;
				text-align: center;
				border-radius: 16rpx;
				height: 140rpx;
				box-sizing: border-box;

				.disabled1 {
					padding-top: 30rpx;

					text {
						color: #AAA !important;
					}
				}


				text {
					display: block;
					color: #333;

					&:nth-child(2) {
						margin: 8rpx 0;
					}

					&:nth-child(3) {
						color: #007A69;
						font-weight: bold;
					}
				}

				&.disabled {
					text {
						color: #AAA;
					}
				}

				&:last-child {
					padding-top: 40rpx;

					text {
						//color: #007A69;

					}

				}
			}

			.itemSelected {
				// background: linear-gradient(90deg, #0EBFFE 0%, #00D3E8 100%);
				background-color: #F0F8F6;
				border: 2rpx solid #007A69;
				font-size: 24rpx;
				text-align: center;
				font-weight: bold;
				border-radius: 16rpx;

				text {
					display: block;
					color: #007A69;

					&:nth-child(2) {
						margin: 8rpx 0;
						color: #007A69;
					}

					&:nth-child(3) {
						color: #007A69;
					}
				}

				&:last-child {
					padding-top: 40rpx;
					color: #007A69;
				}
			}
		}

		.pcInfo {
			display: flex;
			justify-content: space-between;
			padding-top: 34rpx;
			padding-bottom: 13rpx;

			text {
				font-size: 30rpx;
				font-weight: bold;
				color: #111;

				&.txts {
					width: 200rpx;
					flex: 1;
					font-weight: inherit;
					font-size: 26rpx;
					text-align: right;
				}
			}

			&.first {
				padding: 34rpx 0;
				border-bottom: 1rpx solid #EFEFEF;
			}
		}

		.Ycrules {
			width: 168rpx;
			height: 54rpx;
			background-color: #F0F8F6;
			line-height: 54rpx;
			display: flex;
			justify-content: center;
			align-items: center;
			border-radius: 27rpx;
			margin-bottom: 20rpx;
			margin-top: 10rpx;
		}
	}

	.details {
		padding: 60rpx 30rpx 200rpx;


		.title {
			position: relative;
			text-align: center;

			text {
				font-size: 36rpx;
				font-family: PingFang-SC-Bold, PingFang-SC;
				font-weight: bold;
				color: #333333;
			}

			image {
				width: 36rpx;
				height: 36rpx;
				position: absolute;
				right: 10rpx;
				top: 50%;
				margin-top: -18rpx;
			}
		}

		// .address {
		// 	font-size: 32rpx;
		// 	font-family: PingFang-SC-Bold, PingFang-SC;
		// 	font-weight: bold;
		// 	color: #333333;
		// 	margin-top: 48rpx;
		// }

		.tickets {
			display: flex;
			align-items: center;
			justify-content: space-between;
			margin-top: 42rpx;

			&>text {
				font-size: 26rpx;
				font-family: PingFangSC-Regular, PingFang SC;
				font-weight: 400;
				color: #777777;
			}

			&>view {
				font-size: 28rpx;
				font-family: PingFang-SC-Bold, PingFang-SC;
				font-weight: bold;
				color: #333333;

				span {
					font-size: 24rpx;
					font-family: PingFangSC-Regular, PingFang SC;
					font-weight: 400;
					color: #777777;
				}
			}
		}

		.total {
			display: flex;
			align-items: center;
			justify-content: space-between;
			margin-top: 61rpx;

			text {
				font-size: 32rpx;
				font-family: PingFang-SC-Bold, PingFang-SC;
				font-weight: bold;
				color: #333333;
			}

			view {
				height: 36rpx;
				font-size: 32rpx;
				font-family: PingFang-SC-Bold, PingFang-SC;
				font-weight: bold;
				color: #333333;
			}
		}

		.d_middle {
			padding: 40rpx 0 150rpx;

			&>view {
				display: flex;
				align-items: center;
				justify-content: space-between;
				padding: 40rpx 0;

				&:first-child {
					border-bottom: 1rpx solid #EFEFEF;
				}

				&>text {
					font-size: 28rpx;
					font-family: PingFangSC-Regular, PingFang SC;
					font-weight: 400;
					color: #333333;
				}

				&>view {
					font-size: 30rpx;
					font-family: PingFang-SC-Bold, PingFang-SC;
					font-weight: bold;
					color: #333333;
					display: flex;
					align-items: center;

					span {
						font-size: 26rpx;
						font-family: PingFangSC-Regular, PingFang SC;
						font-weight: 400;
						color: #777777;
						margin-left: 10rpx;
					}
				}
			}
		}



		.has_info {
			.add_user {
				height: 88rpx;
				// border-radius: 16rpx;
				display: flex;
				justify-content: center;
				align-items: center;
				background: #fff;
				margin-top: 50rpx;
				background-image: url('https://i.ringzle.com/file/20240415/5d72e22d58744b9bb740a3333d3d2b42.png');
				background-repeat: no-repeat;
				background-size: 100% 100%;
				// padding: 16rpx;

				image {
					width: 26rpx;
					height: 26rpx;

				}


				text {
					font-size: 32rpx;
					font-family: PingFangSC-Regular, PingFang SC;
					font-weight: 400;
					color: #007A69;
					margin-left: 12rpx;
					letter-spacing: 2rpx;
				}
			}

			.add_list {
				padding-top: 30rpx;
				max-height: 478rpx;
				overflow-y: auto;

				.sac_item {
					display: flex;
					align-items: center;
					padding: 36rpx 24rpx;

					.chk {
						width: 38rpx;
						height: 38rpx;
					}

					.si_info {
						width: calc(100% - 96rpx);
						padding-left: 22rpx;

						.name {
							display: flex;
							align-items: center;

							view:first-child {
								font-size: 32rpx;
								font-family: PingFang-SC-Bold, PingFang-SC;
								font-weight: bold;
								color: #111111;
								line-height: 32rpx;
							}

							view:last-child {
								padding: 6rpx 8rpx;
								line-height: 24rpx;
								text-align: center;
								background: #F5F8FA;
								border-radius: 8rpx;
								font-size: 24rpx;
								font-family: PingFangSC-Regular, PingFang SC;
								font-weight: 400;
								color: #94A9C8;
								margin: 5rpx 0 0 28rpx;
							}
						}

						.idcard {
							margin-top: 20rpx;

							&>text {
								font-size: 24rpx;
								font-family: PingFangSC-Regular, PingFang SC;
								font-weight: 400;
								color: #111111;
								line-height: 24rpx;

								&:first-child {
									color: #AAAAAA;
									margin-right: 10rpx;
								}
							}
						}
					}

					.edit {
						width: 36rpx;
						height: 36rpx;
					}
				}


			}
		}


	}

	// 延迟规则
	.YcRulesContent {
		padding: 40rpx 0 0;
		height: 720rpx;
		overflow: hidden;

		.title {
			position: relative;
			text-align: center;
			margin-bottom: 52rpx;
			padding: 0 40rpx;

			text {
				font-size: 36rpx;
				font-family: PingFang-SC-Bold, PingFang-SC;
				font-weight: bold;
				color: #333333;
			}

			image {
				width: 36rpx;
				height: 36rpx;
				position: absolute;
				right: 10rpx;
				top: 50%;
				margin-top: -18rpx;
			}
		}

		.p {
			line-height: 54rpx;
			padding: 0 40rpx;
		}
	}

	.add_submit {
		width: calc(100% - 50rpx);
		height: 88rpx;
		background: #007A69;
		border-radius: 44rpx;
		position: fixed;
		bottom: 69rpx;
		font-size: 32rpx;
		font-family: PingFang-SC-Bold, PingFang-SC;
		font-weight: bold;
		color: #FFFFFF;
		left: 25rpx;
		line-height: 88rpx;
		text-align: center;
	}

	.num {
		display: flex;
		align-items: center;
		justify-content: space-between;
		margin-bottom: 16rpx;

		.input {
			margin: 0 30rpx;
			font-size: 28rpx;
		}

		text {
			font-size: 24rpx;
			color: #FF4141;

			&:nth-child(1) {
				font-size: 28rpx;
				color: #333;
				font-weight: bold;
				font-family: PingFang-SC-Bold, PingFang-SC;
			}

			&:nth-child(3) {
				font-size: 36rpx;
				color: #FF4141;
				margin-right: 40rpx;
			}

			&.icon {
				display: inline-block;
				width: 100rpx;
				flex: 1;
				text-align: right;
				padding-top: 12rpx;
			}
		}
	}

	.minus,
	.plus {
		justify-content: center;
		display: flex;
		width: 44rpx;
		height: 44rpx;
		line-height: 44rpx;
		padding: 11rpx 9rpx;
		border: 1px solid #999;
		border-radius: 6rpx;
		box-sizing: border-box;
	}

	.plus {
		background-color: #007A69;
		border-color: #007A69;
	}
	.cellBox2 {
		box-sizing: border-box;
		background-color: #fff;
		border-radius: 16rpx;
		// padding: 12rpx;
		margin: 24rpx;
		padding: 35rpx 30rpx;
		display: flex;
		justify-content: space-between;
	
		.cellBox-left {
			display: flex;
			align-items: center;
	
			.icon {
				border-radius: 6rpx;
				background-color: #ff4141;
				width: 30rpx;
				height: 30rpx;
				color: #fff;
				font-size: 20rpx;
				text-align: center;
				line-height: 30rpx;
				margin-right: 10rpx;
			}
	
			.title {
				color: #666666;
				font-size: 30rpx;
				font-weight: Regular;
				// margin-left: 260rpx;
			}
		}
	
		.cellBox-right {
			display: flex;
			width: 70%;
			justify-content: space-between;
			align-items: center;
	
			.cellBox-text {
				color: #aaaaaa;
				font-size: 28rpx;
				// margin-left: 260rpx;
			}
	
			.image {
				width: 24rpx;
				height: 24rpx;
	
				image {
					width: 100%;
					height: 100%;
				}
			}
		}
	}
	.cellBox {
		.icon {
			border-radius: 6rpx;
			background-color: #FF4141;
			width: 34rpx;
			height: 34rpx;
			color: #fff;
			font-size: 22rpx;
			text-align: center;
			line-height: 34rpx;
			margin-right: 6rpx;
		}

		.title {
			display: flex;
			align-items: center;
			width: 100%;

			.input {
				padding-left: 10rpx;
				font-size: 26rpx
			}

			text {
				font-size: 30rpx;
				margin-right: 38rpx;

				&:last-child {
					color: #AAA;
					font-size: 26rpx;
				}
			}

		}
	}

	/deep/.u-cell__body .data-v-1c4434ae {
		align-items: flex-start;
	}
</style>